<!-- 申请人 -->
<template>
	<view class="">
		<mescroll-uni @init="mescrollInit" @down="downCallback" @up="upCallback" height="100%" :up="upOption"
			@emptyclick="pageBack">
			<view class="u-p-30">
				<view class="bg-white radius20 u-m-b-30" v-for="(item,index) in list" :key="index">
					<view class="u-flex u-border-bottom" style="padding: 10rpx 30rpx 10rpx 10rpx;"
						@click="$u.route('/pages/subpage/profile/index',{id:item.user_info.uid})">
						<view class="avatar">
							<u-avatar :src="item.user_info.avatar" show-level :level-bg-color="$appConfig.mainColor"
								size="80"></u-avatar>
						</view>
						<view class="u-flex-1 font-medium">{{item.user_info.real_name}}</view>
						<view>报价：<text class="price">{{item.price}}</text></view>
					</view>
					<view class="u-p-30">
						<view class="u-font-32 font-medium u-line-1 u-m-b-20">{{item.title}}</view>
						<view class="u-flex">
							<view class="u-flex-1"><text class="u-light-color">申请时间：{{item.add_time}}</text></view>
							<u-button type="warning" plain size="mini" hover-class="none" shape="circle" class="u-m-l-20"
								:customStyle="{backgroundColor:'#ffffff !important'}" @click="toAction(item.id)">同意接单</u-button>
						</view>
					</view>
				</view>
			</view>
		</mescroll-uni>
	</view>
</template>

<script>
	import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
	export default {
		mixins: [MescrollMixin],
		data() {
			return {
				demId: '',
				list: [],
				upOption: {
					empty: {
						use: true,
						icon: '/static/success.png',
						tip: "您的需求已成单",
						btnText: "返回",
						fixed: false,
						top: "100rpx",
						zIndex: 99
					}
				},
			}
		},
		onLoad(e) {
			this.demId = e.id;
			// this.queryApplyer()
		},

		onShow() {
			if (this.refresh) {
				this.queryApplyer()
			}
			this.refresh = true
		},
		methods: {
			pageBack() {
				uni.navigateBack()
			},
			upCallback() {
				this.queryApplyer()
			},
			queryApplyer() {
				this.$u.api.applyerList({
					id: this.demId
				}).then(res => {
					this.list = res
					this.mescroll.endSuccess(res.length);
				})
			},
			toAction(id) {
				this.$u.route({
					url: '/pages/subpage/order/action_dem_user',
					params: {
						role: 'user',
						type: 'order',
						id: id
					},
					type: 'redirectTo'
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.avatar {
		transform: scale(0.6);
	}
</style>